<!--
 * @Author: Allen
 * @Date: 2021-03-25 14:50:21
 * @Description: 抱怨身处黑暗，不如提灯前行。愿你在自己存在的地方，成为一束光，照亮世界的一角
 * @LastEditTime: 2021-03-26 14:27:35
 * @LastEditors: Allen
 * @FilePath: \dmocdms_webend\src\components\QueryComponent\QueryComponentD.vue
 * @Additional: 附加类容
-->
<template>
  <section class="query-comp">
    <div class="query-comp__header" :style="`width: ${width};`">
      <div class="filter-container filter-title" @click="changeShow">
        {{ title }}
        <span class="query-comp__header-icon">
          <i :class="isShow ? 'el-icon-caret-bottom' : 'el-icon-caret-top'"></i>
        </span>
      </div>
    </div>
    <el-collapse-transition>
      <div v-show="isShow">
        <el-table
          :data="list"
          border
          stripe
          @selection-change="repairTypeDelete"
        >
          <el-table-column
            align="center"
            type="selection"
            width="40"
          ></el-table-column>
          <el-table-column
            prop="updateControlId"
            v-if="false"
          ></el-table-column>
          <el-table-column
            label="序号"
            align="center"
            width="60"
            type="index"
          ></el-table-column>
          <el-table-column
            prop="wiCode"
            align="center"
            label="工时编码"
          ></el-table-column>
          <el-table-column
            prop="wiName"
            align="center"
            label="维修内容"
          ></el-table-column>
          <el-table-column
            prop="repairTypeCode"
            align="center"
            label="维修类型"
          >
            <template slot-scope="scope">
              <el-select
                v-model="scope.row.repairTypeCode"
                placeholder="请选择"
                @change="repairTypeChange(scope)"
              >
                <el-option
                  v-for="(item, index) in repairTypeArr"
                  :key="index"
                  :label="item.LOOKUP_VALUE_NAME"
                  :value="item.LOOKUP_VALUE_CODE"
                >
                </el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column prop="payKind" align="center" label="付费性质">
            <template slot-scope="scope">
              <el-select
                v-model="scope.row.payKind"
                @change="repairTypeChange(scope)"
                placeholder="请选择"
              >
                <el-option
                  v-for="(item, index) in payKindArr"
                  :key="index"
                  :label="item.LOOKUP_VALUE_NAME"
                  :value="item.LOOKUP_VALUE_CODE"
                >
                </el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column
            prop="saleWorkQty"
            align="center"
            label="工时数"
          ></el-table-column>
          <el-table-column
            prop="wiPrice"
            align="center"
            label="工时单价"
          ></el-table-column>
          <el-table-column
            prop="wiAmount"
            align="center"
            label="费用合计"
          ></el-table-column>
          <el-table-column prop="retRepairType" align="center" label="维修类别">
            <template slot-scope="scope">
              <el-select v-model="scope.row.retRepairType" placeholder="请选择">
                <el-option
                  v-for="(item, index) in retRepairArr"
                  :key="index"
                  :label="item.LOOKUP_VALUE_NAME"
                  :value="item.LOOKUP_VALUE_CODE"
                >
                </el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column
            prop="wiDiscountRate"
            align="center"
            label="折扣率"
          ></el-table-column>
          <el-table-column
            prop="wiPreAmount"
            align="center"
            label="费用预估"
          ></el-table-column>
          <el-table-column
            prop="comboSaleCode"
            label="套餐/精品编码"
            align="center"
          ></el-table-column>
          <el-table-column prop="isEntrustCode" align="center" label="是否委外">
            <template slot-scope="scope">
              <el-select v-model="scope.row.isEntrustCode" placeholder="请选择">
                <el-option label="是" value="1"> </el-option>
                <el-option label="否" value="0"> </el-option>
              </el-select>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </el-collapse-transition>
  </section>
</template>

<script>
import request from "@/utils/request.js";
export default {
  props: {
    width: {
      type: String,
      default: "50%",
    },
    title: {
      type: String,
    },
    tableHeight: {
      type: Number,
    },
    formField: {
      type: Object,
    },
    // list: {
    //   type: Array,
    // },
  },
  data() {
    return {
      isShow: true,
      list: [],
      retRepairArr: [],
      repairTypeArr: [],
      payKindArr: [],
    };
  },
  mounted() {
    this.repairInfo();
  },
  methods: {
    repairInfo() {
      request({
        url:
          "/mp/e3sh/aftersale/WorkOrderManagementService/maintenanceTimeList",
        method: "post",
        data: {
          repairOrderId: this.repairOrderId,
        },
      }).then((res) => {
        this.list = res.rows;
      });
    },
    changeShow() {
      this.isShow = !this.isShow;
    },
    repairTypeChange(e) {
      let index = e.$index;
      let repairWiId = this.list[index].repairWiId;
      let repairTypeCode = e.row.repairTypeCode;
      let payKind = e.row.payKind;
      let comboSaleCode = e.row.comboSaleCode;
      let isEntrustCode = e.row.isEntrustCode;
      let updateControlId = e.row.updateControlId;
      request({
        url: "/mp/e3sh/aftersale/WorkOrderManagementService/maintenanceTimeUpd",
        method: "post",
        data: {
          repairWiId: repairWiId,
          repairTypeCode: repairTypeCode,
          payKind: payKind,
          comboSaleCode: comboSaleCode,
          isEntrustCode: isEntrustCode,
          updateControlId: updateControlId,
        },
      }).then((res) => {
        res.result == 1 ? this.$message(res.msg) : this.$message("编辑失败");
      });
    },
    repairTypeDelete(val) {
      let list = [];
      val.map((item) => {
        list.push(item.repairWiId);
      });
      this.$emit("selectList", list);
    },
  },
};
</script>

<style lang="scss" scoped>
.query-comp {
  width: 100%;
  background-color: #fff;
  // &__header {
  .filter-container.filter-title {
    width: 160px;
    cursor: pointer;
  }
  // }
}
</style>